<template>
  <div id="qr-scan-box" class="fit column items-center"></div>
  <q-inner-loading :showing="loading">
    <q-spinner-ios color="primary" size="50px" />
  </q-inner-loading>
  <!--  <div class="qr-scan-tips">使用钉钉扫码</div>-->
</template>

<script setup>
import { Notify, uid } from 'quasar'
import { userStores } from 'stores/user-stores'
import { computed, nextTick, ref } from 'vue'
import { useRouter } from 'vue-router'
import { DDLogin } from './DDLogin'

const loginParams = computed(() => {
  const path = `${location.origin}${location.path || location.pathname || ''}`
  return { state: uid(), redirect_uri: encodeURIComponent(path) }
})

const router = useRouter()
const loading = ref(false)

const getQR = () => {
  DDLogin({ id: 'qr-scan-box' }, loginParams.value, loginResult => {
    const { authCode, redirectUrl, state, other } = loginResult
    const params = {
      redirect_uri: encodeURIComponent(redirectUrl), ...other, authCode, state, getOSS: true, url: 'work/api/ding/auth'
    }

    loading.value = true
    userStores().LoginByName(params).then(async ({ done }) => {
      await router.replace('/dashboard/console')
      done && done()
      loading.value = !loading.value
    }).catch(() => {
      loading.value = !loading.value
    })
  }, errorMsg => Notify.create({ type: 'negative', message: errorMsg }))
}

nextTick(() => getQR())

</script>